<template>
    
        <van-tabbar v-model="active" active-color="#f00" class="table" @change="changeRouter">
        <van-tabbar-item icon="wap-home-o"   to="/home">首页</van-tabbar-item>
        <van-tabbar-item icon="search"   to="/category">分类</van-tabbar-item>
        <van-tabbar-item icon="cart-o" :badge="$store.state.shopCount" >购物车</van-tabbar-item>
        <van-tabbar-item icon="setting-o"   @change="changeRouter">我的</van-tabbar-item>
        </van-tabbar>


</template>


<script>
export default {
    data() {
    return {
      num:0,
      active: 0,
    };
  },watch:{
    $route(newrouter){
      if(newrouter.path == '/home'){
        this.active = 0
      }else if(newrouter.path == '/category'){
        this.active = 1
      }else if(newrouter.path == '/shop'){
        this.active = 2
      }else {
        this.active = 3
      }
    }
  },
  methods:{
    changeRouter(index){
     if(index==2){
       this.$router.push('/shop').catch(()=>{})
     }else if(index == 3){
       this.$router.push('/mime').catch(()=>{})
     }
      
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
